<template>
  <div class="app">
    <p>姓名：<input type="text" v-model.trim="name"/></p>
    <p>年龄：<input type="number" v-model="age"/></p>
    <p>身高：<input type="text" v-model="height"/>(米)</p>
    <p>体重：<input type="text" v-model="weight"/>(公斤)</p>
    <p>病史：<input type="text" v-model="illness"/></p>
    <button @click="diagnosis">诊断</button>
    <p v-show="result !==''">患者&nbsp;&nbsp;{{ name }}&nbsp;&nbsp;的诊断结果为:&nbsp;&nbsp;{{ result }}</p>
  </div>
</template>

<script>
export default {
  data(){
    return{
      name:'',
      age:'',
      height:'',
      weight:'',
      illness:'',
      result:''
    }
  },
  methods:{
    diagnosis(){
      const bmi = this.weight / (this.height * this.height)
      if(bmi <= 18.5){
         this.result='体重过轻'
      }else if(bmi > 18.5 && bmi <= 24.9){
         this.result ='正常'
      }else if(bmi > 24.9 && bmi <= 29.9){
         this.result = '体重过重'
      }else{
         this.result = '肥胖'
      }
    }
  }
};
</script>

<style>
</style>